<template>
  <div class="student-leave">
    <go-back routerPath="/mine" class="go-back">
      <template #center> 学生请假 </template>
    </go-back>
    <div class="tabcontrol">
      <router-link to="/studentLeave/application">
        <span>请假申请</span>
      </router-link>
      <router-link to="/studentLeave/info">
        <span>请假信息</span>
      </router-link>
    </div>
    <router-view v-slot="props">
      <keep-alive>
        <component :is="props.Component"></component>
      </keep-alive>
    </router-view>
  </div>
</template>

<script lang="js">
import {defineComponent, reactive, ref} from 'vue'
import GoBack from '@/components/go-back/go-back.vue';

export default defineComponent({
  props: {

  },
  components: {
    GoBack
  },
  setup() {


    return { };

  }
})
</script>

<style scoped lang="less">
.student-leave {
  min-height: 100vh;
  background-color: white;
  position: relative;
  z-index: 99;
  .go-back {
    padding: 0 6vw;
    height: 8vh;
  }
  .tabcontrol {
    display: flex;
    a {
      color: #262626;
      flex: 1;
      text-align: center;
      margin: 2.2vh 0;
    }
    a.router-link-exact-active span {
      padding: 0 2vw;
      padding-bottom: 1.8vw;
      color: var(--van-theme-color);
      border-bottom: 2px solid var(--van-theme-color);
    }
  }
}
</style>
